import React, { useContext, useEffect, useState } from 'react';
import { Input, message, Space } from 'antd';
import { ConfigsContext } from '../..';
export function JsonInput(props) {
  var propOwner = props.propOwner,
    propName = props.propName;
  var forceRender = useContext(ConfigsContext).forceRender;
  var _a = useState(''),
    value = _a[0],
    setValue = _a[1];
  var handleBlur = function () {
    try {
      propOwner[propName] = JSON.parse(value);
      forceRender();
    } catch (e) {
      message.error(
        ''.concat(propName, '\u503C\u8BF7\u8F93\u5165\u6B63\u786EJSON\u683C\u5F0F\uFF01')
      );
    }
  };
  useEffect(function () {
    setValue(JSON.stringify(propOwner[propName]));
  }, []);
  return React.createElement(
    Space,
    null,
    React.createElement('strong', null, propName, '\uFF1A'),
    React.createElement(Input, {
      value: value,
      onChange: function (e) {
        return setValue(e.target.value);
      },
      onBlur: handleBlur,
      placeholder: '\u8BF7\u8F93\u5165JSON\u683C\u5F0F\uFF01',
      addonAfter: 'JSON'
    })
  );
}
